<template>
  <div  class="content-prescription">
    <el-row type="flex" class="row-bg" justify="end">
      <div class="border-style mar-right-l" style="padding-left:20px;padding-right:20px;">
        <el-radio v-model="radio" label="1">门诊</el-radio>
        <el-radio v-model="radio" label="2">住院</el-radio>
      </div>
      <div>
        <el-date-picker
          v-model="value1"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </div>
      <el-col :span="2">
        <el-button type="success" round>查询</el-button>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-row style="padding-left:10px;padding-right:10px;">
      <div>
        <el-table
          :data="tableData"
          :height="tableHeight"
          style="width: 100%">
          <el-table-column
            prop="date"
            label="操作时间"
            width="150">
          </el-table-column>
          <el-table-column
            prop="deptname"
            label="科室"
            width="120">
          </el-table-column>
          <el-table-column
            prop="ptname"
            label="患者姓名"
            width="120">
          </el-table-column>
          <el-table-column
            prop="iono"
            label="门诊号/住院号"
            width="120">
          </el-table-column>
          <el-table-column
            prop="dr"
            label="开立医生"
            width="80">
          </el-table-column>
          <el-table-column
            prop="name"
            label="项目"
            width="100">
          </el-table-column>
          <el-table-column
            prop="count"
            label="数量"
            width="100">
          </el-table-column>
          <el-table-column
            prop="days"
            label="天数"
            width="60">
          </el-table-column>
          <el-table-column
            prop="freq"
            label="频次"
            width="150">
          </el-table-column>
          <el-table-column
            prop="price"
            label="单价"
            width="100">
          </el-table-column>
           <el-table-column
            prop="drmodel"
            label="规格"
            width="100">
          </el-table-column>
           <el-table-column
            prop="unit"
            label="单位"
            width="100">
          </el-table-column>
           <el-table-column
            prop="sum"
            label="总金额"
            width="100">
          </el-table-column>
           <el-table-column
            prop="reason"
            label="拒绝理由"
            width="300">
          </el-table-column>
        </el-table>
      </div>
    </el-row>
  </div>
</template>

<script>
import moment from 'moment'

export default {
  data () {
    return {
      radio: '1',
      tableHeight: window.innerHeight - 214,
      value1: [moment().subtract(30, 'days'), new Date()],
      tableData: [{
        date: '2021-02-25 11:12:34',
        deptname: '心血管内科',
        ptname: '张三',
        iono: '90009091',
        dr: '喜羊羊',
        name: '降压药',
        days: 10,
        count: 10,
        freq: '每天一次',
        price: 30.82,
        drmodel: '10g/片*10',
        unit: '片',
        sum: 308.2,
        reason: '上次开立时间2月1日,剩余3日可以继续开立'
      }]
    }
  }
}
</script>

<style lang="scss">
  .content-prescription {
    margin-top: 20px;
    line-height: 40px;
    text-align: center;

    .border-style {
      border-radius: 30px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
    }

    .mar-right-l {
      margin-right: 20px;
    }

    .content-timeline {
      line-height: 20px;
    }

    .content-event {
      line-height: 80px;
    }
  }
</style>
